<template>
	<view>
		<view class="phone-title">
			<view class="info">
				提示: 手机号将用于接收各类信息推送，请填写常用手机号
			</view>
		</view>
		<view class="phone-input">
			<u--input style="height: 96rpx;font-size: 32rpx;" placeholder="请您输入手机号码" border="none" v-model="numberphone" clearable></u--input>
		</view>
		<view class="comfir-btn">
			<view class="qd-btn" @click="$dianji(updateNumberPhone,'onoff')">
				确&nbsp;&nbsp;定
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				onoff:true,
				tips: '',
				numberphone: '',//手机号码
				currentPhone:''
			}
		},
		onLoad(options) {
			this.currentPhone =options.currentphone;
		},
		methods: {
			//提交
			updateNumberPhone(){
				if (!this.numberphone) {
					uni.showToast({
						icon: 'none',
						title: '手机号码不能为空！'
					})
					return
				}
				let reg =/^[1][3,4,5,7,8,9][0-9]{9}$/; //正则表达式定义手机号正确格式
				if (!reg.test(this.numberphone)) {        //判断手机号格式时候正确
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					})
					return
				}
				uni.$u.http.put(`/base/mobile/userInfo/updateUserTel`, {
					userTel:this.numberphone
				}).then(res => {
					if (res.code == 0) {
						uni.$u.toast('修改成功！')
						uni.navigateBack({
							delta: 1
						})
					}
				}).catch(err => {})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #ffffff;
		padding: 0 32rpx;
		box-sizing: border-box;
	}

	.phone-title {
		font-size: 28rpx;
		color: #000000;
		padding: 48rpx 0rpx 40rpx 0rpx;
		background: #fff;
		.info{
			font-size: 28rpx;
			color: #8C8C8C;
		} 
	}

	.phone-input {
		height: 96rpx;
		border-radius: 6px;
		color: #A6A6A6;
		font-size: 32rpx;
		background: #F2F2F2;
		padding: 0 32rpx;
		.u-input{
			height: 96rpx;
			font-size: 32rpx;
		}
	}
	.comfir-btn{
		width: 100%;
		height: 96rpx;
		margin-top: 64rpx;
		.qd-btn{
			width: 100%;
			height: 96rpx;
			line-height: 96rpx;
			border-radius: 12rpx;
			background: #0F53AC;
			color: #fff;
			font-size: 34rpx;
			text-align: center;
		}
	}
</style>
